import 'package:eh_mobile/common/utils/extension.dart';
import 'package:eh_mobile/common/utils/nav_bar_title.dart';
import 'package:eh_mobile/pages/control/temp_control/controller.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_svg/svg.dart';
import 'package:get/get.dart';
import '../../../common/style/bny_color.dart';
import '../../../common/utils/enums.dart';
import '../../../common/values/svg_image.dart';
import '../common_control/common_control_utils.dart';
import '../device_info/view.dart';
import '../light_control/controller.dart';
import '../light_control/widgets/light_control_bottom.dart';
import 'package:animated_flip_counter/animated_flip_counter.dart';

import '../light_control/widgets/select_mode_overlay.dart';

class TempControlPage extends StatefulWidget {
  const TempControlPage({super.key});

  @override
  State<TempControlPage> createState() => _TempControlPageState();
}

class _TempControlPageState extends State<TempControlPage> {
  TempControlController controller = Get.put(TempControlController());
  double iconBtnWidth = 46.w;
  double iconWidth = 24.w;
  LightControlController lightControlController =
      Get.put(LightControlController());

  @override
  Widget build(BuildContext context) {
    return NavBarTitle(
      appBarColor: const Color.fromRGBO(50, 50, 50, 0.8),
      childWidget: Container(
        color: BnyColor.bgBlackColor,
        child: GetBuilder(
            id: controller.tempViewId,
            builder: (TempControlController tempControlController) {
              return Stack(
                children: [
                  Column(
                    children: [
                      Expanded(
                        child: Column(
                          children: [
                            Padding(
                              padding: EdgeInsets.only(top: 19.h, left: 21.w),
                              child: CommonControlUtils.percentView(
                                  'assets/svgs/temp_control/ic_humidity_value.svg',
                                  controller.brightnessValue,
                                  textFontSize: 18,
                                  textPercentSize: 16),
                            ),
                            138.sizedBoxHeight,
                            GetBuilder(
                                id: controller.tempValueViewId,
                                builder: (TempControlController tempVC) {
                                  return GestureDetector(
                                    onPanStart: (ges) {
                                      if (tempVC.isShow) {
                                        return;
                                      }
                                      tempVC.isShow = true;
                                      if (controller.isOffSwitch) {
                                        tempVC.opacity = 1.0;
                                        tempVC.update([tempVC.addViewId]);
                                        controller.addObserverTimer();
                                      }
                                    },
                                    child: AnimatedFlipCounter(
                                      curve: Curves.bounceInOut,
                                      value: tempVC.tempValue,
                                      fractionDigits: 0, // 小数点位数
                                      textStyle: TextStyle(
                                        fontSize: 115.sp,
                                        fontWeight: FontWeight.w300,
                                        color: controller.isOffSwitch
                                            ? BnyColor.light222WhiteColor
                                            : BnyColor.gray238IconColor,
                                      ),
                                    ),
                                  );
                                }),
                            54.sizedBoxHeight,
                            GetBuilder(
                                id: controller.currentTempValueViewId,
                                builder:
                                    (TempControlController tempController) {
                                  Color? borderColor =
                                      tempController.getTemperatureColor(
                                          controller.currentTempValue);
                                  return Container(
                                    padding: EdgeInsets.symmetric(
                                        horizontal: 14.w, vertical: 5.h),
                                    decoration: BoxDecoration(
                                      borderRadius: BorderRadius.circular(25.r),
                                      border: Border.all(
                                        width: 1.r,
                                        color: borderColor!,
                                      ),
                                    ),
                                    child: AnimatedFlipCounter(
                                      curve: Curves.bounceInOut,
                                      value: tempController.currentTempValue,
                                      fractionDigits: 1, // 小数点位数
                                      textStyle: TextStyle(
                                          color: borderColor, fontSize: 22.sp),
                                    ),
                                  );
                                }),
                            Padding(
                              padding: EdgeInsets.only(left: 78.w, top: 25.h),
                              child: Row(
                                children: [
                                  GetBuilder(
                                      id: controller.choseModeViewId,
                                      builder: (TempControlController tempVC) {
                                        return getRoundPicAndNum(
                                          iconBgColor: controller
                                              .getDifferentHotBgColor(),
                                          iconStr: tempVC.choseModeIconName,
                                          iconColor:
                                              controller.getDifferentColor(),
                                        ).onClick(() {
                                          SelectModeOverlay.show(
                                            context,
                                            controller.choseModelList,
                                            selectModeOverlayCallBack:
                                                (value, name) {
                                              tempVC.choseDifferentMode(name);
                                            },
                                          );
                                        },
                                            isForbiddenTap:
                                                !controller.isOffSwitch);
                                      }),
                                  24.sizedBoxWidth,
                                  GetBuilder(
                                      id: controller.badgeWindValueViewId,
                                      builder: (TempControlController
                                          tempController) {
                                        return getRoundPicAndNum(
                                            num:
                                                tempController.currentWindValue,
                                            isShow: true,
                                            iconStr:
                                                'assets/svgs/temp_control/ic_speed_unsel.svg',
                                            iconBgColor: tempController
                                                .getDifferentBgColorFromWindIcon(),
                                            iconColor: tempController
                                                .getDifferentIconColorFromWindIcon());
                                      }).onClick(() {
                                    if (controller.currentWindValue ==
                                        controller.maxWindValue) {
                                      controller.currentWindValue = 0;
                                    }
                                    controller.currentWindValue++;
                                    controller.update(
                                        [controller.badgeWindValueViewId]);
                                  }, isForbiddenTap: !controller.isOffSwitch),
                                  35.sizedBoxWidth,
                                  Container(
                                    width: 1,
                                    height: 24.h,
                                    color: BnyColor.light100WhiteColor,
                                  ),
                                  34.sizedBoxWidth,
                                  getRoundPicAndNum(
                                          iconBgColor:
                                              controller.getDifferentBgColor(),
                                          iconColor: controller.isOffSwitch
                                              ? const Color.fromRGBO(
                                                  0, 150, 208, 1.0)
                                              : const Color.fromRGBO(
                                                  238, 238, 238, 0.8),
                                          iconStr:
                                              'assets/svgs/light_control/ic_power_on.svg')
                                      .onClick(() {
                                    controller.closeBtnAction();
                                  }),
                                ],
                              ),
                            ),
                          ],
                        ),
                      ),
                      GetBuilder(
                          id: controller.bottomScrollViewId,
                          builder: (TempControlController tempController) {
                            return LightControlBottom(
                              currectIndex:
                                  lightControlController.currectIndex.value,
                              type: DeviceLListType.temp,
                              tapCallback: (index) {
                                lightControlController.currectIndex.value =
                                    index;
                                lightControlController.showColourDisk.value =
                                    index != 0;
                                controller.update([
                                  controller.bottomScrollViewId,
                                ]);
                              },
                            );
                          }),
                    ],
                  ),
                  GetBuilder(
                      id: controller.addViewId,
                      builder: (TempControlController tempVC) {
                        return Positioned(
                          right: 0.w,
                          top: 180.h,
                          width: 100.w,
                          height: 46.w * 2 + 30.w,
                          child: AnimatedOpacity(
                            opacity: controller.opacity,
                            duration: Duration(
                                milliseconds:
                                    controller.opacity > 0 ? 300 : 1000),
                            curve: controller.opacity > 0
                                ? Curves.easeIn
                                : Curves.easeOut,
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: [
                                getRoundPicAndNum(
                                  iconStr:
                                      'assets/svgs/temp_control/temp_ic_up.svg',
                                  iconColor: BnyColor.lightWhiteColor,
                                  iconBgColor: BnyColor.lightAlphaWhiteColor,
                                ).onClick(() {
                                  // tempVC.addAction();
                                  tempVC.tempAddChangeAction();
                                }),
                                getRoundPicAndNum(
                                  iconStr:
                                      'assets/svgs/temp_control/temp_ic_down.svg',
                                  iconColor: BnyColor.lightWhiteColor,
                                  iconBgColor: BnyColor.lightAlphaWhiteColor,
                                ).onClick(() {
                                  // tempVC.subAction();
                                  tempVC.tempSubChangeAction();
                                }),
                              ],
                            ),
                          ),
                        );
                      }),
                ],
              );
            }),
      ),
      name: '${Get.arguments}',
      actions: [
        UnconstrainedBox(
          child: Container(
            width: 42.r,
            height: 32.r,
            margin: EdgeInsets.only(right: 14.r),
            padding: const EdgeInsets.fromLTRB(0, 2, 0, 2).r,
            decoration: BoxDecoration(
              color: const Color.fromRGBO(222, 222, 222, 0.1),
              borderRadius: BorderRadius.circular(16.r),
            ),
            child: SvgPicture.asset(
              SVGImage.icMoreSvg,
              colorFilter:
                  const ColorFilter.mode(Colors.white, BlendMode.srcIn),
            ),
          ).onClick(() {
            Get.to(const DeviceInfoPage(), arguments: Get.arguments);
          }),
        )
      ],
    );
  }

  //圆形图标
  Widget getRoundPicAndNum({
    int num = 1,
    bool isShow = false,
    required String iconStr,
    Color? iconColor,
    Color? iconBgColor,
  }) {
    return SizedBox(
      width: iconBtnWidth + 2.5.w,
      height: iconBtnWidth + 5.w,
      child: Stack(
        children: [
          Positioned(
            left: 0,
            bottom: 0,
            child: Container(
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(iconBtnWidth / 2.0),
                color: iconBgColor ?? const Color.fromRGBO(5, 185, 235, 0.1),
              ),
              width: iconBtnWidth,
              height: iconBtnWidth,
              child: UnconstrainedBox(
                child: SvgPicture.asset(
                  iconStr,
                  colorFilter: ColorFilter.mode(
                    iconColor ?? const Color.fromRGBO(5, 185, 235, 1.0),
                    BlendMode.srcIn,
                  ),
                ),
              ),
            ),
          ),
          Visibility(
            visible: isShow,
            child: Positioned(
              right: 0,
              top: 0,
              child: Container(
                padding: EdgeInsets.symmetric(horizontal: 7.w, vertical: 0.5),
                decoration: BoxDecoration(
                  color: const Color.fromRGBO(34, 34, 34, 1.0),
                  border: Border.all(
                      color: BnyColor.light100WhiteColor, width: 1.r),
                  borderRadius: BorderRadius.circular(15.r),
                ),
                child: Text(
                  num.toString(),
                  style: TextStyle(
                      color: controller.getDifferentIconColorFromNumIcon(),
                      fontSize: 12.sp),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }

  @override
  void initState() {
    super.initState();
  }

  @override
  void dispose() {
    super.dispose();
  }
}
